<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        class Queue{
            /*
                既然用数组去封装队列行不通，我们就用对象。
                不过要额外定义两个变量:
                    lowCount用来记录队头的下标
                    count用来记录当前的队尾。
            */ 
            #items = {};
            #lowCount = 0;
            #count = 0;

            // 入队
            enQueue(data){
                // 对象也是可以通过obj[propName]去读取或赋值的
                this.#items[this.#count] = data;
                // 每次放入队列一个，那么队尾的标识变量就要+1
                this.#count++;
            }

            // 出队
            delQueue(){
                // 判断一下，如果队列为空，那就是不能执行删除元素操作的
                if(this.isEmpty()){
                    console.log('别删了，已经没了~呜呜呜~~');
                    return;
                }
                // 先用一个变量记录下要被删除的这个队头元素，要不然等下删了就没了
                let res = this.#items[this.#lowCount];
                // 然后删掉这个元素
                delete this.#items[this.#lowCount];
                // 把这个队头标识+1，因为当前队头已经被删了，那么下一个元素就成了队头
                this.#lowCount++;
                // 返回这个元素
                return res;
            }

            // 读取头部元素
            front(){
                // 返回队头元素
                return this.#items[this.#lowCount]
            }

            // 是否为空
            isEmpty(){
                // 很容易理解，不做解释
                return this.size()==0
            }

            // 队列长度
            size(){
                // 队尾减去队头，不就是长度吗
                return this.#count - this.#lowCount;
            }

            // 重置队列
            clear(){
                // 直接全部重置
                this.#items = {};
                this.#count = 0;
                this.#lowCount = 0;
            }

            toString(){
                let str = '';

                // 循环方式1
                // for(let i = this.#lowCount;i<this.#count;i++){
                //     str+=`${this.#items[i]}`;
                // }

                // 循环方式2
                for(let item in this.#items){
                    str+=`${this.#items[item]} `;
                }
                return str;
            }
        }

        let queue = new Queue();

        
    </script>
</body>
</html>